<template>
	<div id="templ">
		<ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media" v-for="item in list">
					<router-link :to="'/news/newsinfo/'+item.id">
						<img class="mui-media-object mui-pull-left" :src="item.img_url">
						<div class="mui-media-body">
							{{item.title}}
							<p class='mui-ellipsis'>{{item.zhaiyao}}</p>
						</div>
						<div class="ft">
							<span>发表时间:  {{item.add_time | datefmt("YYYY-MM-DD HH:mm:ss")}}</span>
							<span>点击数:	{{item.click}}</span>
						</div>
					</router-link>
				</li>
			</ul>
	</div>
	
</template>


<script>
	export default {
		data:function(){
			return {
				list:[]
			}
		},
		methods:{
			getnews:function(){
				var url = this.$common.apidomain+"/api/getnewslist"
				this.$http.get(url).then(function(res){
					if(res.body.status !=0) {
						this.Toast(res.body.message);
						return;
					}
					
					this.list = res.body.message;
				})
			}
		},
		created:function(){
			this.getnews();
		}
	}


</script>



<style scoped>
	.mui-table-view-cell img {
		width: 80px;
		height: 80px;
		max-width: 80px;
	}
	.mui-media-body {
		font-size: 20px;
		margin-bottom: 1em;
		box-sizing:border-box;
	}
	.mui-media-body p {
		font-size: 14px;
		margin-top: 1em;
	}
	.ft {
		font-size: 12px;
		color: #0094ff;
		margin-top: -1em;
	}
	.ft span:nth-of-type(2) {
		margin-left: 1em;
	}
</style>